<template>
	<view style="display: block;">
		<!--
		scaleToFill 不保持比例，占满
		aspectFill 保持比例，短边显示，长边截断
		aspectFit 保持比例，长边显示
		left 不缩放，显示左边
		-->
		<image class="iiii" src="../../static/image.jpg" mode="scaleToFill"></image>
		<image class="iiii" src="../../static/image.jpg" mode="aspectFill"></image>
		<image class="iiii" src="../../static/image.jpg" mode="aspectFit"></image>
		<image class="iiii" src="../../static/image.jpg" mode="left"></image>
		<image class="iiii" src="../../static/image.jpg" mode="widthFix"></image>
		<image class="iiii" src="../../static/image.jpg" mode="center"></image>
		<image class="iiii" src="../../static/image.jpg" mode="bottom right"></image>
		<!-- <cover-image class="iiii" src="../../static/image.jpg" mode="widthFix"/> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
			}
		},
		methods: {
			
		}
	}
</script>

<style>
	.iiii{
		width: 300rpx;
		height: 300rpx;
		margin: 10rpx 10rpx 10rpx 10rpx;
	}
</style>
